<?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<link  media="screen" rel="stylesheet" href="css/custom-theme/jquery-ui-1.8.1.custom.css"/>
		<link  media="screen" rel="stylesheet" href="css/style.css"/>
		
		<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
		<script type="text/javascript" src="js/jquery-ui-1.8.1.custom.min.js"></script>
		<script type="text/javascript" src="js/preguntas.js"></script>
		<script type="text/javascript" src="js/coordenadas.js"></script>
		<script type="text/javascript" src="js/dado.js"></script>
		<script type="text/javascript" src="js/dialogs.js"></script>
		<script type="text/javascript" src="js/game.js"></script>
        <title>Econopolio</title>
    </head>
    <body>
    	<div id="playerInfo" class="section left">
    		<div id="player">
				<h2 id="playerName"></h2>
				<h3 id="playerJob"></h3>
				<label id="playerCompany"></label>
    		</div>
			<div id="game">
				<p>
					<label>Score: </label><label class="bold" id="playerScore">$600.0</label>
				</p>
				<p>
					<label>Comodines disponibles: </label>
					<ul>
						<li><label id="comodinSaltarPregunta" class="bold">Saltar pregunta</label></li>
						<li><label id="comodinEliminarOpciones" class="bold">Eliminar opciones</label></li>
					</ul>
				</p>
			</div>
			
    	</div>
		<div id="controls" class="section right">
			<div>
				<input type="button" id="btnStartNewGame" class="button" value="Reiniciar juego" />
				<div id="caraDado" onClick="toggleDado()"></div>
				<input type="button" id="btnAnimDado" class="button" value="Lanzar dado" onclick="toggleDado()" />
			</div>
		</div>
    	<div id="background" class="section center">
    		<img  src="media/monopoly1.png"/>
    	</div>
		
		<!-- Dialogs -->
		<div id="confirmDialog" style="display: none;">
			<p>
				<label id="dialogMsg"></label>
			</p>
			<p>
				<input type="button" class="button" value="Si" onclick="closeConfirmDialog(true)" />
				<input type="button" class="button" value="No" onclick="closeConfirmDialog(false)" />
			</p>
		</div>
		<div id="questionDialog" style="display: none">
			<p>
				<img id="questionImage" src="" alt="" />
				<label id="dialogQuestion">Ejemplo de pregunta</label>
			</p>
			<p id="questionList">
				<input id="btnQuestion1" type="button" class="questionButton" value="Ejemplo de opción 1" onclick="evaluarRespuesta(1)" />
				<input id="btnQuestion2" type="button" class="questionButton" value="Ejemplo de opción 2" onclick="evaluarRespuesta(2)" />
				<input id="btnQuestion3" type="button" class="questionButton" value="Ejemplo de opción 3" onclick="evaluarRespuesta(3)" />
			</p>
			<p>
				<div id="result"></div>
				<div id="resultImg"></div>
			</p>
		</div>
		<div id="newPlayerDialog" style="display: none;">
			<ul>
				<li><label>Jugador:</label> <input id="txtJugador" type="text" /></li>
				<li><label>Puesto:</label> <input id="txtPuesto" type="text" /></li>
				<li><label>Empresa:</label> <input id="txtEmpresa" type="text" /></li>
				<li><label> </label> <input id="btnEmpezar" type="button" class="button" onclick="closeNewPlayerDialog()" value="Empezar" /></li>
			</ul>
		</div>
		<div id="gameOverDialog" style="display: none;">
			<p>
				<label>Juego terminado. usted tiene capital cero en su empresa. Debe jugar nuevamente</label>
			</p>
			<p>
				<div class="gameOver"></div>
			</p>
			<p>
				<input id="btnOk" type="button" class="button" onclick="closeGameOverDialog();" value="OK" />
			</p>
		</div>
		<div id="winDialog" style="display: none;">
			<p>
				<label id="title">Felicidades!</label>
			</p>
			<p>
				<div class="gameWin"></div>
			</p>
			<p>
				<label id="content">Has participado contestando # preguntas, de las cuales # fueron correctamente contestadas. Tu puntuación es de #%</label>
			</p>
			<p>
				<input id="btnOk" type="button" class="button" onclick="closeWinDialog();" value="OK" />
			</p>
		</div>
		<div id="playerIcon"></div>
    </body>
</html>
